{:W('Cate/header')}
{:W('Cate/left')}

<!--内容部分-->
<div class="content">
    <div class="title">
        <p>区域管理</p>
        <i class="icon-angle-right"></i>
        <p class="active">区域列表</p>
    </div>
    <div class="admin_list clearfix">
        <div class="main">
            <div class="main_title">
                <form action="{:U('area_list/area_list')}" method="get">
                <ul class="clearfix">
                    <li>
                        <span>区域名称</span>
                        <input value="{$param.name}" maxlength="20"  name="name" type="text">
                    </li>
                    <button><img src="__PUBLIC__/images/seach.png">搜索</button>
                </ul>
                </form>
            </div>
            <div class="main_list">
                <div class="main_list_new">
                    <button id="area_list"><img src="__PUBLIC__/images/add_j.png">新增</button>
                </div>
                <div class="main_list_list user_list">
                    <dl>
                        <dt>
                            <span style="width:5%">序号</span>
                            <span style="width:20%;text-align:left;padding-left:20px;">区域名称</span>
                            <span style="width:18%">管理员数量</span>
                            <span style="width:18%">用户数量</span>
                            <span style="width:18%">设备数量</span>
                            <span style="width:20%">操作</span>
                        </dt>
                        <volist name="array['areas']" id='row' key="k">
                        <dd>
                            <span style="width:5%">{$k}</span>
                            <span style="width:20%;text-align:left;padding-left:20px;">{$row['name']}</span>
                            <span style="width:18%">{$row['managenum']}</span>
                            <span style="width:18%">{$row['usernum']}</span>
                            <span style="width:18%">{$row['devnum']}</span>
                            <span style="width:20%">
                                    <a href="javascript:;" class="xg" data-json='{$row|json_encode}'>修改</a>
                                    <a href="javascript:;" onclick="del_area('{$row.id}','{$row.name}')">删除</a>
                            </span>
                        </dd>
                        </volist>
                    </dl>
                </div>
            </div>
            <div class="fy" id="page"></div>
        </div>
    </div>
</div>
<!--弹框-->
<!--添加子组织-->
<div class="hk"></div>
<div class="add_group area_list">
    <div class="add_group_title">
        <img src="__PUBLIC__/images/i_guanbi.png" class="icon-remove">新增
    </div>
    <div class="add_group_center">
        <ul>
            <li>
                <span>
                    <i>*</i>区域名称：
                </span>
                <input value="" name="name" maxlength="10" type="text">
            </li>
        </ul>
    </div>
    <div class="add_group_btn">
        <button>确定</button>
        <button>取消</button>
    </div>
</div>
<div class="add_group area_list2">
    <div class="add_group_title">
        <img src="__PUBLIC__/images/i_guanbi.png" class="icon-remove">修改
    </div>
    <div class="add_group_center">
        <ul>
            <li>
                <span>
                    <i>*</i>区域名称：
                </span>
                <input value="" name="name" maxlength="10" type="text">
            </li>
        </ul>
    </div>
    <div class="add_group_btn">
        <button>确定</button>
        <button>取消</button>
    </div>
</div>
</body>
<script type="text/javascript">
    // 分页
    layui.use('laypage', function(){
        var laypage = layui.laypage;
        //执行一个laypage实例
        laypage.render({
            elem: 'page'
            ,count: "<?php echo $totnum; ?>"
            ,limit: "<?php echo $pagecount; ?>"
            ,layout: ['prev', 'page', 'next', 'limit', 'skip']
            ,curr:function(){
                var page = location.search.match(/pageid=(\d+)/);
                return page ? page[1] : 1;
            }()
            ,jump: function(obj,first){  //点击页码出发的事件
                if(first!=true){  //是否首次进入页面
                    var name = "<?php echo $param['name']; ?>";
                    var _url = "/area_list/area_list?pageid="+obj.curr+"&pagecount="+obj.limit;
                    if(name || status){
                        _url = "/area_list/area_list?pageid="+obj.curr+"&pagecount="+obj.limit+"&name="+name;
                    }
                    window.location.href = _url;
                }
            }
        });
    });


    $(document).ready(function () {
        //添加
        getPopup($('#area_list'),$('.area_list'));
        //修改
        $('.user_list').find('.xg').each(function () {
            var _this = $(this);
            getPopup(_this,$('.area_list2'));
        });

        // 添加区域
        $('.area_list button').eq(0).on('click',function(){
            // 获取数据
            var name = $('.area_list input').val();
            if(!$.trim(name)){
                layer.msg('请填写区域名称',{icon:2,time:2000});
                return;
            }
            $.post("{:U('area_list/AddArea_post')}",{name:name},function(data){
                if(data.result == '0'){
                    layer.msg('新增区域成功！',{icon:1,time:2000},function(){
                        location.reload();
                    });
                } else {
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            })
        })

        // 获取编辑区域的基本信息
        $('.main_list').on('click','.xg',function(){
            var _json = $(this).attr('data-json');
            _json = JSON.parse(_json);
            var area = $('.area_list2');
            area.find('input[name="name"]').val(_json.name);
            area_id = _json.id;   // 全局
        })

        // 编辑区域
        $('.area_list2 button').eq(0).on('click','',function(){
            // 获取输入框的内容
            var name = $('.area_list2 input').val();
            if(!$.trim(name)){
                layer.msg('请填写区域名称',{icon:2,time:2000});
                return;
            }
            $.post("{:U('area_list/ModifyArea_post')}",{name:name,areaid:area_id},function(data){
                if(data.result == '0'){
                    layer.msg('修改区域成功！',{icon:1,time:2000},function(){
                        location.reload();
                    });
                } else {
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            })
        })
    })

    // 删除区域
    function del_area(obj,name){
        if(!$.trim(obj)){
            layer.msg('请填写区域名称',{icon:2,time:2000});
            return;
        }
        var _length = $('.user_list dd').length;
        layer.confirm('<font style="color: red;">*</font> 确认要删除'+name+'区域吗！',function(index){
            $.post("{:U('area_list/DelArea_post')}",{areaid:obj},function(data){
                if(data.result == '0'){
                    layer.msg('删除区域成功！',{icon:1,time:2000},function(){
                        var _layui_input = $('.layui-laypage-skip .layui-input');
                        if(_length <= 1 && _layui_input.val() > 1){   // 获取上一页
                            _layui_input.val(_layui_input.val()-1);
                            $('#page .layui-laypage-btn').click();
                        } else {   // 刷新当前页
                            location.reload();
                        }
                    });
                } else {
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            })
        })
    }
</script>
</html>